@import '~ant-design-vue/es/style/themes/default.less';

html,
body,
#app, #root {
  height: 100%;
}

.ant-form-item {
  margin-bottom: 5px;
}

.ant-input {
  border-radius: 4px;
}

.ant-modal-header {
  border-radius: 6px 6px 0px 0px;
}

.ant-modal-content {
  border-radius: 6px;
}

.ant-modal-title {
  font-weight: bold;
}

.ant-layout.layout-basic {
  height: 100vh;
  min-height: 100vh;
}

.ant-pro-basicLayout-content {
  margin: 16px;
}

.ant-card-body {
  padding: 16px;
}
canvas {
  display: block;
}

body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

ul, ol {
  list-style: none;
}

// 数据列表 样式
.table-alert {
  margin-bottom: 16px;
}
// 数据列表 操作
.table-operator {
  margin-bottom: 18px;

  button {
    margin-right: 8px;
  }
}

// 分页组件的数字间隔 
.ant-pagination-item {
  margin-right: 3px;
}

.ant-pagination-total-text {
  margin-right: 3px;
}

.ant-pagination-prev, .ant-pagination-jump-prev, .ant-pagination-jump-next {
  margin-right: 3px;
}
.ant-pagination-options {
  margin-left: 3px;
}

// 表单参数校验错误信息在页面最上层显示
.ant-form-explain, .ant-form-extra {
  position: relative;
  z-index: 999;
}

// 表单控件的配置，label和输入框在同一行，并且输入框占满当前一行
/**  :model="formInline" @submit="handleSubmit" @submit.native.prevent */
/**
  <a-form-model layout="inline">
    <a-col :lg="12" :md="12" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行两列1">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="12" :md="12" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行两列2">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="8" :md="8" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行三列1">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="8" :md="8" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行三列2">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="8" :md="8" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行三列3">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="6" :md="6" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行四列1">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="6" :md="6" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行四列2">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="6" :md="6" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行四列3">
        <a-input/>
      </a-form-item>
    </a-col>
    <a-col :lg="6" :md="6" :sm="24" style="padding-right: 12px;">
      <a-form-item label="一行四列4">
        <a-input/>
      </a-form-item>
    </a-col>
  </a-form-model>
*/
// 表单控件的配置，label和输入框在同一行，并且输入框占满当前一行
// .ant-form-inline 的 .ant-form-item 样式设置了 a-form-item的lebel与输入框是换行的，必现覆盖官方的配置

.ant-form-inline {
  .ant-form-item {
    display: flex;
    margin-bottom: 8px;
    margin-right: 0;

    .ant-form-item-control-wrapper {
      flex: 1 1;
      display: inline-block;
      vertical-align: middle;
    }

    > .ant-form-item-label {
      line-height: 32px;
      padding-right: 2px;
      width: 90px;
      min-width: 90px;
      max-width: 90px;
      white-space: inherit;
    }
    .ant-form-item-control {
      height: 32px;
      line-height: 32px;
    }
  }
}

.ant-tree-child-tree > li:first-child {
  padding-top: 0px;
}

.ant-tree li {
  padding: 0px;
}

.ant-table-thead > tr > th, .ant-table-tbody > tr > td {
  padding: 6px 6px;
  overflow-wrap: break-word;
}

.ant-menu-inline-collapsed {
  width: 48px;
}

.ant-pro-sider-menu {
  width: 48px;
}
/**
设置一行多列 
设置表单的label和该label对应输入框在同一行显示，输入框占据剩余的所有空间
.ant-form-inline {
  .ant-form-item {
    display: flex;
    margin-bottom: 8px;
    margin-right: 0;

    .ant-form-item-control-wrapper {
      flex: 1 1;
      display: inline-block;
      vertical-align: middle;
    }
  }
}
*/